first of all goto header page >> new Tag code >> past this code

<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.5.0/highlight.min.js"></script> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.5.0/styles/atom-one-light.min.css" integrity="sha512-o5v54Kh5PH0dgnf9ei0L+vMRsbm5fvIvnR/XkrZZjN4mqdaeH7PW66tumBoQVIaKNVrLCZiBEfHzRY4JJSMK/Q==" crossorigin="anonymous" referrerpolicy="no-referrer" /> <script>hljs.initHighlightingOnLoad();</script>

and go to footer page >> New code >> past this code

<script language="javascript">
var msg=document.getElementsByName("bbcodes");
for(var i=0;i<msg.length;i++){
var oldtext=document.getElementsByName("bbcodes")[i].innerHTML;
var newtext=oldtext.replace(/(^|[\n ])([\w]+?:\/\/[^ ,\"\n\r\t<]*)/ig, "$1");newtext=newtext.replace(/\[url=(.+?)\](.+?)\[\/url\]/ig, "<a href='$1'>$2</a>");
newtext=newtext.replace(/\[img\](.+?)\[\/img\]/ig,"<img src='$1' width='100%'>");
newtext=newtext.replace(/\[b\](.+?)\[\/b\]/ig, "<b>$2</b>");
newtext=newtext.replace(/\[i\](.+?)\[\/i\]/ig, "<i>$1</i>");
newtext=newtext.replace(/\[s\](.+?)\[\/s\]/ig, "<s>$1</s>")
newtext=newtext.replace(/\[color=(.+?)\](.+?)\[\/color\]/ig, "<font color='$1'>$2</color>");
newtext=newtext.replace(/\[code\](.+?)\[\/code\]/ig, "<pre style='background-color: white ; font-weight: bold ; font-weight: bold'><code>$1</code><pre>");
newtext=newtext.replace(/\[left\](.+?)\[\/left\]/ig, "<span align='left'>$1</span>");
newtext=newtext.replace(/\[right\](.+?)\[\/right\]/ig, "<span align='right'>$1</span>");
newtext=newtext.replace(/\[center\](.+?)\[\/center\]/ig, "<span align='center'>$1</span>");
newtext=newtext.replace(/\[input\](.+?)\[\/input\]/ig, "<input type='text' value='$1'/>"); 
newtext=newtext.replace(/\[textarea\](.+?)\[\/textarea\]/ig, "<textarea>$1</textarea>");newtext=newtext.replace(/\[youtube=(.+?)\](.+?)\[\/youtube\]/ig, "<iframe src='$1' width='100%'/>");newtext=newtext.replace(/\[size=(.+?)\](.+?)\[\/size\]/ig, "<font size='$1'>$2</size>");newtext=newtext.replace(/\[br\]/ig, "<br/>");
newtext=newtext.replace(/\[hr\]/ig, "<hr/>");
document.getElementsByName("bbcodes")[i].innerHTML=newtext;
}
</script>

now replace your %content% %value1%


etc with

<span name="bbcodes">%content%</span>

all is done enjoy it